JavaScript 中遍历方法小结

遍历方法小结

常用的遍历方法

• for 遍历
• forEach（对数组的每个元素执行一次提供的函数）
• map（创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果）

for 遍历大家都熟悉，所以重点讲一下forEach 与 map 的区别

• 相同点：

  1. 回调函数参数相同，都自带三个属性：item / index / array
  2. 均不会修改原数组
  3. 第二参数this的指向均指向window（可是使用箭头函数进行修改）
  4. 只能遍历数组
  5. 都不能使用循环跳出语句 break & continue

• 不同点：

  • forEach

    1. 返回值为undefined

  • map

    1. 返回值为一个新的数组
    2. 可以链式调用

      // 链式调用
      var str = 'abcde';
      // 使用call在字符类型中使用map方法
      Array.prototype.map.call(str, function(x) {   
        return x;
      }).reverse().join('');
      // edcba

其他遍历方法

• filter (创建一个新数组, 其包含通过所提供函数实现的测试的所有元素)
• find (返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined)
• every (测试数组的所有元素是否都通过了指定函数的测试)
• some (测试是否至少有一个元素通过由提供的函数实现的测试)

【Attention】
filter 将遍历所有的元素
find & some & every 属于「条件中断」遍历（即当元素满足某一条件是返回boolean）
四个方法都不会对原数组进行修改

---

ES5 中的for...in 遍历

常用于对象key值的遍历

ES6 引入的遍历方法

• for...of 遍历

  [ 前置知识：for...of 可对具有iterator接口的数据结构进行遍历 ]

  • 原生具有iterator接口的数据结构如下：

    • Array
    • Set
    • Map
    • String
    • TypedArray
    • NodeList 对象
    • 函数的arguments 对象

• keys( ) / values( ) / entries( )

  常用来遍历对象、数组、set、map结构

【番外】

• 改变原数组的方法
  pop、push、reverse、shift、sort、splice、unshift
• 不会改变原数组的方法
  concat、join、slice、toString、toLocaleString、indexOf、lastIndexOf